import 'dart:async';

import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_1800/pages/home.dart';
import 'package:flutter_1800/pages/user/registerView.dart';
import 'package:flutter_1800/pages/widgets/MyText.dart';
import 'package:flutter_1800/service/api_service.dart';
import 'package:flutter_1800/tools/AppUtil.dart';
import 'package:flutter_1800/tools/config.dart';
import 'package:flutter_1800/tools/storage.dart';
import 'package:flutter_easyloading/flutter_easyloading.dart';

class LoginViewPage extends StatefulWidget {
  const LoginViewPage({Key? key}) : super(key: key);

  @override
  _LoginViewPageState createState() => _LoginViewPageState();
}

class _LoginViewPageState extends State<LoginViewPage> {
  final FocusNode _focusNodeUserName = FocusNode();
  final FocusNode _focusNodePassWord = FocusNode();

  //用户名输入框控制器，此控制器可以监听用户名输入框操作
  final TextEditingController _phoneController =
      TextEditingController(text: "");
  final TextEditingController _passWordController =
      TextEditingController(text: "");
  final TextEditingController _vcodeController = TextEditingController();

  //表单状态
  final GlobalKey<FormState> _formKey = GlobalKey<FormState>();

  int loginType = 1;

  final bool _checkAgreement = false; //是否显示输入框尾部的清除按钮

  Timer? _timer;
  int seconds = 60;
  bool isWechatInstalled = false;
  bool passwordLogin = false;

  @override
  void initState() {
    super.initState();
    _focusNodeUserName.addListener(_focusNodeListener);
    _focusNodePassWord.addListener(_focusNodeListener);
  }

  @override
  void dispose() {
    if (_timer != null) {
      _timer!.cancel();
    }
    super.dispose();
  }

  // 监听焦点
  Future<void> _focusNodeListener() async {
    if (_focusNodeUserName.hasFocus) {
      // 取消验证码框的焦点状态
      _focusNodePassWord.unfocus();
    }
    if (_focusNodePassWord.hasFocus) {
      // 取消用户名框焦点状态
      _focusNodeUserName.unfocus();
    }
  }

  void loginHandler() {
    if (_phoneController.text.isEmpty) {
      EasyLoading.showInfo("手机号或者密码不能为空");
      return;
    }

    if (_vcodeController.text.isEmpty) {
      EasyLoading.showInfo("手机号或者密码不能为空");
      return;
    }

    ApiService.login({
      "mobile": _phoneController.text,
      "vcode": _vcodeController.text,
    }).then((value) async {
      EasyLoading.showSuccess("登录成功");
      await StorageUtil.saveUser(value);
      AppUtil.user = await StorageUtil.getUser();
      AppUtil.replace(const HomePage());
    }).catchError((e) {});
  }

  void registerHandler() {
    AppUtil.replace(const RegisterViewPage());
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      extendBodyBehindAppBar: true,
      appBar: AppBar(
          shadowColor: Colors.transparent,
          backgroundColor: Colors.transparent,
          foregroundColor: Colors.transparent,
          leading: const Icon(
            Icons.close,
            color: Colors.white,
          ),
          toolbarHeight: 80,
          systemOverlayStyle: SystemUiOverlayStyle.light.copyWith(
              statusBarColor: Colors.transparent,
              statusBarIconBrightness: Brightness.light)),
      backgroundColor: AppConfig.themeDeepColor,
      body: Container(
          padding: AppUtil.getCommonPadding(),
          decoration: const BoxDecoration(),
          child: Column(
            children: [
              Expanded(
                  child: SingleChildScrollView(
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: <Widget>[
                    const SizedBox(height: 100),
                    MyText(
                      "智能电商,值得拥有",
                      textAlign: TextAlign.left,
                      color: Colors.white,
                      fontSize: 20,
                      weight: FontWeight.bold,
                    ),
                    const SizedBox(height: 50),
                    Container(
                        padding: const EdgeInsets.all(20),
                        width: double.infinity,
                        decoration: BoxDecoration(
                            color: Colors.white,
                            borderRadius: BorderRadius.circular(10)),
                        child: Column(
                          children: [
                            const SizedBox(height: 10),
                            Row(
                              crossAxisAlignment: CrossAxisAlignment.center,
                              children: [
                                MyText(
                                  "+86",
                                  color: AppConfig.font2,
                                ),
                                const SizedBox(width: 20),
                                Expanded(
                                    child: TextField(
                                  controller: _phoneController,
                                  keyboardType: TextInputType.number,
                                  decoration: const InputDecoration(
                                      border: InputBorder.none,
                                      hintText: "请输入手机号码",
                                      hintStyle:
                                          TextStyle(color: Color(0xff999999))),
                                ))
                              ],
                            ),
                            const SizedBox(height: 10),
                            Container(
                                height: 1, color: const Color(0xffeeeeee)),
                            Row(
                              mainAxisAlignment: MainAxisAlignment.center,
                              children: [
                                Expanded(
                                    child: TextField(
                                  controller: _vcodeController,
                                  decoration: const InputDecoration(
                                      border: InputBorder.none,
                                      hintText: "请输入密码",
                                      hintStyle:
                                          TextStyle(color: Color(0xff999999))),
                                )),
                              ],
                            ),
                            const SizedBox(height: 20),
                            InkWell(
                              onTap: () {
                                loginHandler();
                              },
                              child: Container(
                                  width: double.infinity,
                                  padding: const EdgeInsets.all(10),
                                  decoration: BoxDecoration(
                                      borderRadius: BorderRadius.circular(30),
                                      color: const Color(0xff367b64)),
                                  child: MyText(
                                    "登录",
                                    color: Colors.white,
                                  )),
                            ),
                            const SizedBox(height: 20),
                          ],
                        )),
                  ],
                ),
              )),
            ],
          )),
    );
  }
}
